<template>
  <div class="app-container">
    <basic-container>
      <avue-crud ref="crud"
                 v-model="vipViewForm"
                 :page="vipViewPage"
                 :data="tableData"
                 :option="tableOption"
                 :table-loading="vipViewLoading"
                 @on-load="getList"
                 @refresh-change="refreshChange"
                 @row-update="rowUpdate"
                 @row-save="rowSave"
                 @row-del="rowDel">
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
import { fetchList, addObj, putObj, delObj } from "@/api/vipManage/vipViewList";
export default {
  name: "crud",
  data() {
    return {
      vipViewForm: {},
      vipViewLoading: false,
      vipViewPage: {
        total: 0,
        currentPage: 1,
        pageSize: 10,
        orderBy: `order by id asc`
      },
      tableOption: {
        index: true,
        border: true,
        stripe: true,
        selection: true,
        maxHeight: 400,
        menuWidth: 280,
        delBtn: false,
        header: false,
        indexLabel: "序号",
        align: "center",
        column: [
          {
            label: "会员编号",
            size: "small",
            prop: "hpcode"
          },
          {
            label: "昵称/真实姓名",
            size: "small",
            prop: "name"
          },
          {
            label: "手机",
            size: "small",
            prop: "phone"
          },
          {
            label: "会员等级",
            size: "small",
            prop: "vipdj"
          },
          {
            label: "积分",
            size: "small",
            prop: "jifen"
          },
          {
            label: "注册时间",
            size: "small",
            prop: "regdate"
          },
          {
            label: "酒店管理员设置",
            size: "small",
            prop: "openid"
          },
          {
            label: "是否是会员",
            size: "small",
            prop: "sfshy"
          },
          {
            label: "余额",
            size: "small",
            prop: "yue"
          }
        ]
      },
      tableData: []
    };
  },
  created() {},
  mounted: function() {},
  methods: {
    getList(page) {
      this.vipViewLoading = true;
      fetchList({
        start: (page.currentPage - 1) * page.pageSize,
        length: page.pageSize,
        orderBy: this.vipViewPage.orderBy
      }).then(res => {
        this.vipViewLoading = false;
        this.vipViewPage.total = res.data.recordsTotal;
        this.tableData = res.data.data;
      });
    },
    rowUpdate(row, index, done) {
      putObj(row).then(() => {
        this.$message({
          showClose: true,
          message: "修改成功",
          type: "success"
        });
        this.getList(this.vipViewPage);
        done();
      });
    },
    refreshChange() {
      this.getList(this.vipViewPage);
      this.$message({
        showClose: true,
        message: "刷新成功",
        type: "success"
      });
    },
    rowDel(row) {
      this.$confirm("是否确认删除", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return delObj(row.id);
        })
        .then(() => {
          this.$message({
            showClose: true,
            message: "删除成功",
            type: "success"
          });
          this.getList(this.vipLevelPage);
        })
        .catch(function() {});
    },
    rowSave(row, done) {
      addObj(Object.assign({}, row)).then(() => {
        this.$message({
          showClose: true,
          message: "添加成功",
          type: "success"
        });
        this.getList(this.vipLevelPage);
        done();
      });
    }
  }
};
</script>

